<template>
	<view class="page bg" @click="callBank">
		<image class="titleBg" src="https://image.srea.org.cn/xcx/daikuan-page-title-bg.png" mode="widthFix"></image>
		<view class="callPhoneWrap bg flex">
			<view class="callPhone top-20 right-20 bg animate__animated animate__tada"></view>
		</view>
	</view>
</template>

<script setup>
import { ref } from 'vue';
import { onLoad, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app';
import { getLoanBankPhone } from '@/common/api/tools';

//电话
let phoneNumber = ref('');

// 页面加载
onLoad((options) => {
	uni.$check_and_login(initPage)
})

// 分享到好友
onShareAppMessage(() => {
	return {
		title: '贷款咨询',
		path: `/pages/tools/dai-kuan/index`,
		imageUrl: '',
	}
})

// 分享到朋友圈
onShareTimeline(() => {
	return {
		title: '贷款咨询',
		query: `puid=${userInfoStore.userInfo.id}`
	}
})

// 初始化页面
async function initPage() {
	try {
		const {status, detail} = await getLoanBankPhone();
		if(status !== 0) {
			uni.$u.toast(detail);
			return;
		}
		phoneNumber.value = detail.phone;
	} catch (error) {
		console.log(error);
	}
}

// 拨打电话
function callBank() {
	uni.makePhoneCall({
		phoneNumber: phoneNumber.value,
		success() {
		}
	})
}
</script>

<style lang="scss" scoped>
.page{
	min-height: 100vh;
	overflow: hidden;
	background-color: #E5F6F0;
	position: relative;
	background-image: url("https://image.srea.org.cn/xcx/daikuan-page-bg.jpg");
	.titleBg{
		width: 56%;
		position: absolute;
		top: 8vh;
		left: 22%;
	}
	.callPhoneWrap{
		width: 300rpx;
		height: 300rpx;
		position: absolute;
		z-index: 10;
		top: 27vh;
		left: 10%;
		background-size: contain;
		background-image: url("https://image.srea.org.cn/xcx/daikuan-call-bg-1.png");
		.callPhone{
			width: 140rpx;
			height: 140rpx;
			background-image: url("https://image.srea.org.cn/xcx/icon/call-pone-white-fill.png");
			background-size: contain;
		}
	}
}
</style>